#mainContent
{
	min-height:950px;
	height:auto;
}
.vertical-menu
{
	float:left;
	margin-top:15px;
	
}
p
{
	font-size:15px;
	text-align:justify;
	line-height:200%;

}
ul.form {
		position:relative;
		background:#fff;
		width:250px;
		margin:auto;
		padding:0;
		list-style: none;
		overflow:hidden;
		
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;	
		
		-webkit-box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1);
		-moz-box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.1);
		box-shadow:  1px 1px 10px rgba(0, 0, 0, 0.1);	
	}

	.form li a {
		width:225px;
		padding-left:20px;
		height:50px;
		line-height:50px;
		display:block;
		overflow:hidden;
		position:relative;
		text-decoration:none;
		text-transform:uppercase;
		font-size:14px;
		color:#686868;
		
		-webkit-transition:all 0.2s linear;
		-moz-transition:all 0.2s linear;
		-o-transition:all 0.2s linear;
		transition:all 0.2s linear;			
	}

	.form li a:hover {
		background:#efefef;
	}

	.form li a.profile {
		border-left:5px solid #008747;
	}

	.form li a.messages {
			border-left:5px solid #fecf54;
	}
		
	.form li a.settings {
			border-left:5px solid #cf2130;
	}

	.form li a.logout {
			border-left:5px solid #dde2d5;
	}	

	.form li:first-child a:hover, .form li:first-child a {
		-webkit-border-radius: 5px 5px 0 0;
		-moz-border-radius: 5px 5px 0 0;
		border-radius: 5px 5px 0 0;
	}

	.form li:last-child a:hover, .form li:last-child a {
		-webkit-border-radius: 0 0 5px 5px;
		-moz-border-radius: 0 0 5px 5px;
		border-radius: 0 0 5px 5px;
	}

	.form li a:hover i {
		color:#ea4f35;
	}

	.form i {
		margin-right:15px;
		
		-webkit-transition:all 0.2s linear;
		-moz-transition:all 0.2s linear;
		-o-transition:all 0.2s linear;
		transition:all 0.2s linear;	
	}

	.form em {
		font-size: 10px;
		background: #ea4f35;
		padding: 3px 5px;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		border-radius: 10px;		
		font-style: normal;
		color: #fff;
		margin-top: 17px;
		margin-right: 15px;
		line-height: 10px;
		height: 10px;		
		float:right;
	}

	.form li.selected a {
		background:#efefef;
	}

	h1 {
		color:#fff;
		margin:0 auto;
		margin-top:120px;
		margin-bottom:40px;
		font-size:30px;
		width:300px;
		text-align:center;
	}
	
	/* Right Content */
	
.right-content
{
	width: 670px;
	margin:15px;
	
	
	float:right;
	
	
}

/* Setting Info */
.submit { 	
		width: 120px; 
		color: #eee; 
		text-transform: uppercase;
		margin-left:300px;
		margin-top: 15px;
		margin-bottom:15px;
		padding:5px;
		
		background-color: #18a5cc;
		border: none;
		
		/* -- CSS3 Transition - define which property to animate (i.e. the shadow)  -- */
		-webkit-transition: -webkit-box-shadow 0.3s linear;
		
		/* -- CSS3 - Rounded Corners -- */
		-moz-border-radius: 4px; 
		-webkit-border-radius: 4px;
		border-radius: 4px; 
						
		/* -- CSS3 Shadow - create a shadow around each input element -- */ 
		background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#18a5cc), to(#0a85a8)); 
		background: -moz-linear-gradient(25% 75% 90deg,#0a85a8, #18a5cc);		
	} 
	.submit:hover { 		
		-webkit-box-shadow: 0px 0px 20px #555;
		-moz-box-shadow: 0px 0px 20px #aaa; 
		box-shadow: 0px 0px 20px #555;	
		cursor:  pointer; 
	}
legend
{
	padding: 5px;
	margin-left:250px;
	display: block;
	font-weight: bold;
	font-size:24px;
	color:#F60;
	margin-bottom:20px;
}
#edit-account input  { 
   border:none; 
   -webkit-border-radius:5px; 
   -moz-border-radius:5px; 
   border-radius:5px; 
   -webkit-box-shadow:0 0 5px #666 inset; 
   -moz-box-shadow:0 0 5px #666 inset; 
   box-shadow:0 0 5px #666 inset; 
   height:30px; 
   line-height:25px; 
   width:200px; 
   text-indent:5px; 
} 
#edit-account 
{
	padding-left:10px;	
}
#edit-account p
{
	margin-bottom:10px;
	font-size:16px;
	padding-left:10px;
	padding-right:10px;
}
#editText 
 {
	 width: 180px;
	 
 }
 #editText
 {
	 font-size:16px;
	font-weight:bold;
	padding-left:10px;
 }
 #editValue
 {
	 padding-left:10px;
	 margin-bottom:10px;
 }
 #userPicture
 {
	 float:right;
	 width: 250px;
	 height:auto;
	 overflow:hidden;
 }
 #userPicture img
 {
	 border: 2px solid #CCC;
	 height:204px;
	 width:204px;
	 margin-left:10px;
	 margin-bottom:20px;
 }
 #editPic
 {
	 width:650px;
	 font-size:16px;
	 padding-left:10px;
	
 }
  #editPic strong
  {
	  font-size:13px;
  }
  #editThongbao
  {
	  padding-left:10px;
  }
  #left
  {
	  padding-left:20px;
	  float:left;
	  width:120px;
	  font-size:14px;
	  font-weight:bold;
	  margin-bottom:10px;
  }
  #right
  {
	  
	  float:left;
	 width: 520px;
	  margin-bottom:10px;
  }
  #editInfo input  { 
   border:none; 
   -webkit-border-radius:5px; 
   -moz-border-radius:5px; 
   border-radius:5px; 
   -webkit-box-shadow:0 0 5px #666 inset; 
   -moz-box-shadow:0 0 5px #666 inset; 
   box-shadow:0 0 5px #666 inset; 
   height:30px; 
   line-height:25px; 
   width:200px; 
   text-indent:5px; 
} 
#contentUpload p
{
	padding-left:10px;
	padding-right:10px;
}
#contentUpload ol
{
	list-style-type:decimal;
	padding-left:50px;
	padding-right:10px;
}
#contentUpload h2
 {
	 color:#F60;
	 border-bottom:2px solid #ccc;
	 margin-bottom:15px;
	 margin-top:20px;
 }
 
 .pagination 
{
    text-align: center;
    margin: 20px
}
.pagination a, .pagination strong 
{
    background: #fff;
    display: inline-block;
    margin-right: 3px;
    padding: 4px 12px;
    text-decoration: none;
	line-height: 1.5em;
	
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
.pagination a:hover 
{
    background-color: #BEBEBE;
    color: #fff;
}
.pagination a:active {
	background: rgba(190, 190, 190, 0.75);
}
.pagination strong 
{
    color: #fff;
    background-color: #BEBEBE;
}

/* Complaints */

.tabs {
    position: relative;
    width: 680px;
	height:700px;
	margin-bottom:20px;
}

.tabs input[id*="tab"] {
    position: absolute;
    z-index: 1000;
    width: 120px;
    left: 0px;
    top: 0px;
    opacity: 0;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    cursor: pointer;
}
.tabs input[id*="tab"]#tab-2 {
    left: 120px;
}

.tabs input[id*="tab"]#tab-3 {
    left: 280px;
}

.tabs label {
    background: -webkit-linear-gradient(bottom, #ededed 0%,#ddd 100%);
    height: 40px;
    width: 120px;
    font: 16px/40px sans-serif;
    position: relative;
    padding: 0 20px;
    float: left;
    display: block;
    margin: 0 2px 0 0;
    color: #666;
    text-align: center;
    border-radius: 6px 6px 0 0;
    box-shadow: 2px 0 1px rgba(0,0,0,0.1), -2px 0 2px rgba(0,0,0,0.1);
    cursor: pointer;
}

.tabs label:after {
    content: '';
    background: #d1d1d1;
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 100%;
    height: 2px;
    display: block;
}

.tabs input[id*="tab"]:hover + label {
    background: #eee;
}

.tabs label:first-of-type {
    z-index: 4;
    box-shadow: 0 0 4px rgba(0,0,0,0.2);
}

.tab-label-2 {
    z-index: 3;
}

.tab-label-3 {
    z-index: 2;
}

.tabs input[id*="tab"]:checked + label {
    background: -webkit-linear-gradient(top, #ededed 0%,#d1d1d1 100%);
    z-index: 6;
}

.clear-shadow {
    clear: both;
}

.noidunginbox {
    position: relative;
    z-index: 5;
    border-top: solid 2px #ccc;

}

.noidunginbox  div {
    position: absolute;
    
    z-index: 1;
    opacity: 0;
	height:auto;
	overflow:hidden;
    width: 700px;
	padding-right:30px;
	
	
    -webkit-transition: opacity linear 0.1s;
}

.tabs input.tab-selector-1[id*="tab"]:checked ~ .noidunginbox  .noidunginbox-1,
.tabs input.tab-selector-2[id*="tab"]:checked ~ .noidunginbox  .noidunginbox-2,
.tabs input.tab-selector-3[id*="tab"]:checked ~ .noidunginbox  .noidunginbox-3{
    z-index: 100;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;
	

    -webkit-transition: opacity ease-out 0.2s 0.1s;
    -moz-transition: opacity ease-out 0.2s 0.1s;
    -o-transition: opacity ease-out 0.2s 0.1s;
    -ms-transition: opacity ease-out 0.2s 0.1s;
    transition: opacity ease-out 0.2s 0.1s;
}

 .noidunginbox-3 h3
 {
	 color:#666;
	 padding:10px;
	 margin-bottom:30px;
	 display:block;
	 width:100px;
	 float:left;
 }
  .noidunginbox-3 input
  {
	 
	   
	   float:left;
	}
